<script setup>
const { appHeaderRef, appFooterRef } = storeToRefs(useWindowStore())
</script>
<template>
  <div>
    <!-- 🔖此处的ref不要删，体育投注单要计算高度用 -->
    <AppHeader ref="appHeaderRef" />
    <div id="page-content" class="relative z-10 w-full  mx-auto max-w-[1248px]">
      <slot></slot>
    </div>
    <!-- 🔖此处的ref不要删，体育投注单要计算高度用 -->
    <AppFooter ref="appFooterRef" />
  </div>
</template>

<style lang="scss" scoped>
#page-content {
  transform-origin: 50% 50vh;
  padding-top: calc(var(--header) + var(--safe-top));
  padding-bottom: calc(var(--footer) + var(--safe-bottom));

  &:first-child {
    margin-top: .875rem;
  }
}
</style>
